<template>
  <a-tree-select
    style="width:100px;"
    :dropdownStyle="{ maxHeight: '400px', overflow: 'auto' }"
    :treeData="departsData"
    :placeholder="placeholder"
    @change="handleChange"
    :treeDefaultExpandAll="true"
    :value="seletedValue"
  >
  </a-tree-select>
</template>

<script>
import storage from 'store'
import { getDepartByExample } from '../org/department/depart'
const Base64 = require('js-base64').Base64

export default {
  name: 'DepartSelect',
  components: {
  },
  props: {
    orgPid: {
      default: storage.get('org'),
      required: false,
      type: String
    },
    orgName: {
      default: storage.get('orgName'),
      required: false,
      type: String
    },
    parentDepartPid: {
      default: null,
      required: false,
      type: String
    },
    departLevel: {
      default: null,
      required: false,
      type: String
    },
    classType: {
      default: null,
      required: false,
      type: String
    },
    all: {
      default: true,
      required: false,
      type: Boolean
    },
    category: {
      default: null,
      required: false,
      type: String
    },
    authOption: {
      default: '1',
      required: false,
      type: String
    },
    placeholder: {
      default: '选择部门',
      required: false,
      type: String
    },
    value: {
      default: '',
      required: false,
      type: String
    }
  },
  data () {
    return {
      departsData: [],
      seletedValue: this.value === '' ? null : this.value
    }
  },
  beforeCreate () {
  },
  created () {
    this.getTopDepartment()
  },
  mounted () {
  },
  methods: {
    // 通过父部门找下级部门
    getDeparts (parentPid, chardren, authOption) {
      let tn = {}
      new Promise((resolve) => {
        if (authOption) {
        } else {
          authOption = '1'
        }
        const headers = {
          authOption: authOption
        }
        const example = {
          classType: this.classType || null,
          category: this.category || null,
          departLevel: this.departLevel || null,
          parentDepartPid: parentPid || null
        }
        resolve(getDepartByExample(Base64.encode(JSON.stringify(example)), headers))
      }).then(res => {
        if (res && res.code && res.code === 'C1' && res.data) {
          const departments = res.data
          for (let i = 0; i < res.data.length; i++) {
            tn = {
              key: departments[i].pid,
              value: departments[i].pid,
              title: departments[i].departName
            }
            const tnChardren = []
            new Promise((resolve) => {
              resolve(this.getDeparts(tn.value, tnChardren, authOption))
            }).then(resd => {
            })
            if (tnChardren) {
              tn = Object.assign(tn, { children: tnChardren })
            }
            chardren.push(tn)
          }
        }
      })
    },
    // getchange
    handleChange (val) {
      this.$emit('change', val)
    },
    // 初始顶级部门
    getTopDepartment () {
      if (this.all) {
        this.departsData = [{
          key: 'all',
          value: 'all',
          title: '全部'
        }]
      } else {
        this.departsData = []
      }
      let parentDepartPid = ''
      if (this.parentDepartPid) {
        parentDepartPid = this.parentDepartPid
      } else {
        parentDepartPid = this.orgPid
      }
      new Promise((resolve) => {
        resolve(this.getDeparts(parentDepartPid, this.departsData, this.authOption))
      }).then(res => {
        // do
      }).catch(() => {
        // Do something
      }).finally(() => {
      })
    }
  },
  watch: {
    value: function () {
      this.seletedValue = this.value
    },
    orgPid: function () {
      this.getTopDepartment()
    }
  }
}
</script>

<style lang="less">
@import '~ant-design-vue/lib/style/themes/default.less';
</style>
